<template>
    <div class="content">
        <!-- 顶部(ok) -->
        <div class="top">
            <!-- 面包屑(ok) -->
            <a-breadcrumb class="breadcrumb">
                <a-breadcrumb-item>
                    <a href="../main">首页</a>
                </a-breadcrumb-item>
                <a-breadcrumb-item>系统配置</a-breadcrumb-item>
                <a-breadcrumb-item>收费配置</a-breadcrumb-item>
            </a-breadcrumb>

            <!-- 操作栏(ok) -->
            <div class="operation">
                <!-- 根结点显示 -->
                <template v-if="isSelectRoot">
                    <a-button type="primary" style="margin-right: 0.1rem;" @click="addStandardTap">添加收费标准</a-button>
                    <a-button type="primary" style="margin-right: 0.05rem;" @click="addCarTypeTap">添加组织车型</a-button>
                </template>
                <!-- 叶子结点显示 -->
                <template v-if="isSelectLeaf">
                    <a-button type="primary" style="margin-right: 0.1rem;" @click="editStandardTap">修改收费标准</a-button>
                    <a-popconfirm title="确认删除？" okText="确认" cancelText="取消"
                                  @confirm="deleteStandard" placement="topLeft">
                        <a-button type="primary" style="margin-right: 0.05rem;">删除收费标准</a-button>
                    </a-popconfirm>
                </template>
            </div>
        </div>

        <!-- 左边目录树(ok) -->
        <div class="bottom-left">
            <a-directory-tree defaultExpandAll :treeData="treeData" @select="onSelect"/>
        </div>

        <!-- 右边内容 -->
        <template>
            <!-- 根的时候(ok) -->
            <template v-if="isSelectRoot">
                <div class="bottom-right2">
                    <!-- 充值优惠 -->
                    <template v-for="(item,index) in rechargeItemList">
                        <div class="item" :key="index">
                            <div class="itemText">充值优惠</div>
                            <a-input placeholder="充值（元）" v-model="item.minimumAmount"/>
                            -
                            <a-input placeholder="到（元）" v-model="item.maxAmount"/>
                            <a-input placeholder="赠送（元）" v-model="item.favorableAmount"/>
                            <a-button type="danger" icon="delete" @click="removeRechargeTap(index)">移除</a-button>
                        </div>
                    </template>
                    <!-- 操作域名 -->
                    <div class="item">
                        <a-button type="primary" icon="save" @click="saveRechargeTap" :loading="rechargeLoading">保存</a-button>
                        <a-button type="primary" icon="plus" @click="addRechargeTap">添加一项</a-button>
                    </div>
                </div>
            </template>

            <!-- 叶子结点的时候(ok) -->
            <template v-if="isSelectLeaf">
                <!-- ok -->
                <div class="bottom-right">

                    <!-- 中间表格(ok) -->
                    <div class="right-one">
                        <!-- 标题(ok) -->
                        <div style="border: 0.01rem solid rgba(54, 49, 59, 0.25); padding: 10px 5px; width: 325px;">
                            <div style="margin: 0;">
                                <a-icon type="ordered-list" style="padding: 0 0.05rem "/>
                                <div style="font-size: 14px;">收费规则</div>
                            </div>

                            <a-popconfirm
                                    v-if="selectStandardItem"
                                    title="确认删除？" okText="确认" cancelText="取消"
                                    @confirm="deleteStandardChildrenTap" placement="topLeft">
                                <a-icon type="delete" style="padding: 0 0.05rem; cursor: pointer;"/>
                            </a-popconfirm>
                        </div>
                        <!-- 收费规则(ok) -->
                        <template v-for=" s in standardData.childModels">
                            <div
                                    style="padding: 0" :style="standardChildrenStyle(s.id)"
                                    @click="standardChildrenTap(s)" :key="s.id">
                                {{getStandardChildrenName(s)}}
                            </div>
                        </template>
                        <!-- 添加收费规则(ok) -->
                        <div style="padding: 0" @click="addStandardChildrenTap">点此添加收费规则</div>
                    </div>

                    <!-- 创建内容(ok) -->
                    <div class="right-two" v-if="selectStandardItem">
                        <!-- ok -->
                        <div class="standardItem">
                            <!-- ok -->
                            <div class="itemText">日期类型</div>
                            <a-select placeholder="选择日期类型" optionFilterProp="children"
                                      v-model="selectStandardItem.dateType">
                                <a-select-option v-for="d in dateTypeList" :key="d.key" :value="d.key">
                                    {{d.title}}
                                </a-select-option>
                            </a-select>
                            <!-- ok -->
                            <div style="width: 0.8rem;margin-left: 0.2rem;">车型</div>
                            <a-select placeholder="选择车型" optionFilterProp="children"
                                      v-model="selectStandardItem.carType">
                                <a-select-option v-for="c in carTypeList" :key="c.id" :value="c.id">
                                    {{c.typeName}}
                                </a-select-option>
                            </a-select>
                        </div>

                        <!-- ok -->
                        <div class="standardItem">
                            <div class="itemText">时间起</div>
                            <a-time-picker format="HH:mm" v-model="selectStandardItem.st"/>
                            -
                            <a-time-picker format="HH:mm" v-model="selectStandardItem.et"/>
                        </div>

                        <!-- ok -->
                        <div class="standardItem">
                            <div class="itemText">收费方式</div>
                            <a-select placeholder="选择收费方式" optionFilterProp="children"
                                      v-model="selectStandardItem.chargeType">
                                <a-select-option v-for="c in chargeTypeList" :key="c.key" :value="c.key">
                                    {{c.title}}
                                </a-select-option>
                            </a-select>
                        </div>

                        <!-- ok -->
                        <template v-if="selectStandardItem.chargeType == 1">
                            <div class="standardItem">
                                <div class="itemText">收费金额</div>
                                <a-input placeholder="收费金额（元）" v-model="selectStandardItem.fee"/>
                            </div>
                        </template>

                        <!-- ok -->
                        <template v-if="selectStandardItem.chargeType == 3 || selectStandardItem.chargeType == 4">
                            <div class="standardItem">
                                <div class="itemText">阶梯收费</div>
                                <a-textarea style="width: 2rem;" read-only
                                            :value="getStairName(selectStandardItem.stair)"/>
                                <a-icon type="plus-circle" style="width: 0.3rem; height: 0.3rem"
                                        @click="showEditStairView"/>
                            </div>
                        </template>

                        <!-- ok -->
                        <template v-if="selectStandardItem.chargeType == 5">
                            <div class="standardItem">
                                <div class="itemText">阶梯收费</div>
                                <a-textarea style="width: 3rem;" read-only
                                            :value="getStairName2(selectStandardItem.stairAvg)"/>
                                <a-icon type="plus-circle" style="width: 0.3rem; height: 0.3rem"
                                        @click="showEditStairView2"/>
                            </div>
                        </template>

                        <!-- ok -->
                        <template v-if="selectStandardItem.chargeType ==2 || selectStandardItem.chargeType == 4 || selectStandardItem.chargeType == 5">
                            <!-- ok -->
                            <div class="standardItem">
                                <div class="itemText">计时周期</div>
                                <a-input placeholder="计时周期（分钟）" v-model="selectStandardItem.unit"/>
                            </div>

                            <!-- ok -->
                            <div class="standardItem">
                                <div class="itemText">收费单价</div>
                                <a-input placeholder="收费单价（元）" v-model="selectStandardItem.fee"/>
                            </div>

                            <!-- ok -->
                            <div class="standardItem" v-if="selectStandardItem.chargeType !=5">
                                <div class="itemText">周期内免费时长</div>
                                <a-input placeholder="免费时长（分钟）" v-model="selectStandardItem.unitFreeMinute"/>
                            </div>
                        </template>
                        <div class="standardItem">
                            <div class="itemText">默认收费规则</div>
                            <a-switch checkedChildren="是" unCheckedChildren="否"
                                      :checked="switchChecked(selectStandardItem.isDefaultStandard)"
                                      @change="onlineUpgradeSwitchChangedByDefault($event,selectStandardItem)"/>
                        </div>
                    </div>
                </div>

                <!-- 叶子节点规则配置(ok) -->
                <div style="position: absolute; left: 4rem; top: 5.5rem; right: 0rem;">
                    <div class="standardItemBody">
                        <!-- ok -->
                        <div class="standardItem">
                            <div class="itemText">收费上限</div>
                            <a-input placeholder="收费上限（元）" v-model="standardData.moneyCeiling"/>

                            <div class="itemText">收费下限</div>
                            <a-input placeholder="收费下限（元）" v-model="standardData.moneyFloor"/>

                            <div class="itemText">24小时收费上限</div>
                            <a-input placeholder="24小时收费上限（元）" v-model="standardData.dayMoneyCeiling"/>
                        </div>
                        <!-- ok -->
                        <div class="standardItem">
                            <div class="itemText">收费后可占用时长</div>
                            <a-input placeholder="收费后可占用时长（分钟）" v-model="standardData.extraMinute"/>

                            <div class="itemText">允许预收费</div>
                            <a-checkbox :checked="standardData.allowAdvanceFee == 1" @change="() => {
                                    if(standardData.allowAdvanceFee == 1) {
                                        standardData.allowAdvanceFee = 0;
                                    }else {
                                        standardData.allowAdvanceFee = 1;
                                    }
                                }"/>

                            <div class="itemText">常用预收费金额</div>
                            <a-input placeholder="如：2，4，6，8" v-model="standardData.commonAdvanceFee"/>
                        </div>
                        <!-- ok -->
                        <div class="standardItem">
                            <div class="itemText">停车列表</div>
                            <a-textarea style="width:6.5rem;" read-only
                                        :value="getParkName(standardData.parkSimpleModels)"/>
                            <a-button type="primary" icon="user" style="margin: 0 0 0 0.5rem;" @click="showModal">选择停车点</a-button>
                        </div>
                        <!-- ok -->
                        <div class="standardItem" style="justify-content: center;">
                            <a-button type="primary" icon="save" style="margin: 0 0 0 0.5rem;" @click="saveStandardChildren">保存
                            </a-button>
                        </div>
                    </div>
                </div>
            </template>
        </template>
        <!-- 选择停车点(弹窗ok) -->
        <a-modal title="选择停车点" v-model="visible" @ok="selectParkPoint">
            <a-tree
                checkable v-model="selectParkIds"
                :autoExpandParent="false"
                :treeData="parkPointList"/>
        </a-modal>

    </div>
</template>

<script>
    import ATextarea from "ant-design-vue/es/input/TextArea";
    import AddPagesUtils from "../../utils/AddPagesUtils";
    import Constant from "../../utils/Constant";
    import ChargeSettingApi from '../../api/system/ChargeSettingApi';
    import CarTypeApi from '../../api/system/CarTypeApi';
    import moment from 'moment';
    import FavorableApi from '../../api/system/FavorableApi'

    const dateTypeList = [{title: '工作日', key: 1}, {title: '节假日', key: 2}, {title: '日历日', key: 3}];

    const chargeTypeList = [
        {title: '定额按次', key: 1},
        {title: '时长', key: 2},
        {title: '阶梯', key: 3},
        {title: '先阶梯后时长', key: 4},
        {title: '按分钟收费', key: 5},
    ];

    export default {
        name: "ChargeSetting",

        components: {ATextarea},

        data() {
            return {
                /* 车辆 */
                carTypeList: [],
                /* 日期类型 */
                dateTypeList,
                /* 收费类型 */
                chargeTypeList,

                /* 模态框 */
                visible: false,
                parkPointList: [],      /* 停车点 */
                parkingName: [],        /* 列表停车点 */

                /* 收费树 */
                treeData: [],
                selectedChargeKeys: [],
                selectChargeData: undefined,

                /* 修改规则判断 */
                selectStandardItem: {
                    stair: "",
                    stairAvg: "",
                },

                /* 跟结点充值优惠 */
                rechargeItemList: [],
                rechargeLoading: false,

                /* 子节点规则 */
                standardData: {},
                selectParkIds: [],
            };
        },

        methods: {

            /* --------------------- 收费树处理(ok) --------------------- */
            initChargeStandardTreeData() {
                ChargeSettingApi.getChargeStandardTree()
                    .then((data) => this.treeData = [data.data])
                    .catch(() => this.$message.error("获取收费规则树异常！"));
            },

            onSelect(selectedKeys, res) {
                this.selectedChargeKeys = selectedKeys;
                this.selectedChargeData = res.node.dataRef;

                this.clearSelectStandardItem();                             /* 清空选中 */
                if (this.isSelectRoot) {
                    this.loadRechargeData();                                /* 如果根节点(拉取充值优惠) */

                } else if (this.isSelectLeaf) {
                    this.initCarTypeData();                                 /* 车型列表 */
                    this.loadStandardChildren(this.selectedChargeData.id);  /* 拉取优惠规则 */
                }
            },

            clearSelectStandard() {
                this.selectedChargeKeys = [];
                this.selectedChargeData = undefined;
            },

            addStandardTap() {
                AddPagesUtils.showAddPages(Constant.viewType.STANDARD_ADD, undefined, this.saveStandardSuccessCallback);
            },

            editStandardTap() {
                if (!this.isSelectLeaf) {
                    this.$message.warn("请选择要编辑的收费标准！")
                    return;
                }
                let {standardName} = this.selectedChargeData;
                AddPagesUtils.showAddPages(Constant.viewType.STANDARD_EDIT, {standardName}, this.saveStandardSuccessCallback);
            },

            saveStandardSuccessCallback(conditionCallBack) {
                let {operateSign, standardName} = conditionCallBack;
                /* 新增 */
                if (operateSign == 1) {
                    let treeData = this.treeData;
                    ChargeSettingApi.add({standardName})
                        .then((data) => {
                            this.$message.success("添加成功！");
                            let {standardName, id} = data.data;
                            let key = id, title = standardName;
                            treeData[0].children.push({id, standardName, key, title, isLeaf: true});
                        })
                        .catch(err => this.$message.warn(err.data || err.msg || "添加收费标准异常！"));
                    return;
                }
                /* 修改 */
                if (operateSign == 2) {
                    let {id} = this.selectedChargeData;
                    ChargeSettingApi.update({id, standardName})
                        .then(() => {
                            this.$message.success("修改成功！");
                            this.selectedChargeData.standardName = standardName;
                            this.selectedChargeData.title = standardName;
                        })
                        .catch(() => this.$message.warn("修改收费标准名称异常！"));
                    return;
                }
            },

            deleteStandard() {
                if (!this.selectedChargeData) {
                    this.$message.warn("请选择要删除的收费标准！");
                    return;
                }
                let {id} = this.selectedChargeData;
                ChargeSettingApi.del({id})
                    .then(() => {
                        this.$message.success("删除成功！");
                        this.deleteStandardUI(id);
                        this.clearSelectStandard();
                    })
                    .catch(() => {
                        this.$message.warn("删除收费标准异常！");
                    });
            },

            deleteStandardUI(id) {
                let children = this.treeData[0].children || [];
                this.treeData[0].children = children.filter((item) => {
                    return item.id != id
                });
            },

            /* --------------------- 充值优惠(根结点ok) --------------------- */
            loadRechargeData() {
                FavorableApi.list()
                    .then((data) => {
                        let array = data.data || [];
                        this.rechargeItemList = array.map(x => {
                            return {
                                minimumAmount: x.minimumAmount / 100,
                                maxAmount: x.maxAmount / 100,
                                favorableAmount: x.favorableAmount / 100
                            }
                        });
                    })
                    .catch(err => {
                        let data = err.data || "获取充值优惠异常！";
                        this.$message.error(data);
                    });
            },

            addRechargeTap() {
                let item = {minimumAmount: "", maxAmount: "", favorableAmount: ""};
                this.rechargeItemList.push(item);
            },

            removeRechargeTap(index) {
                this.rechargeItemList.splice(index, 1);
            },

            saveRechargeTap() {
                /* ---- 校验 ---- */
                let itemList = this.rechargeItemList || [], len = itemList.length;
                // if (!itemList || len <= 0) return this.$message.warn("请填写数据！");

                /* 校验数据是否合法 */
                for (let i = 0; i < len; i++) {
                    let {minimumAmount, maxAmount, favorableAmount} = itemList[i];
                    if (isNaN(parseInt(minimumAmount)) || isNaN(parseInt(maxAmount)) || isNaN(parseInt(favorableAmount))) {
                        this.$message.error("请输入合法数据");
                        return;
                    }
                    if (parseInt(minimumAmount) > parseInt(maxAmount)) {
                        this.$message.error(`第${i + 1}项最小值最大值错误`);
                        return;
                    }
                }

                /* 校验 */
                for (let i = 1; i < len; i++) {
                    if (itemList[i].minimumAmount <= itemList[i - 1].maxAmount) {
                        this.$message.error(`第${i + 1}项最小值不合法`);
                        return;
                    }
                }

                /* ---- 提交 ---- */
                this.rechargeLoading = true;
                FavorableApi.saveBatch(itemList).then(() => {
                    this.rechargeLoading = false;
                    this.$message.success("保存成功！")
                })
                    .catch(err => {
                        this.rechargeLoading = false;
                        this.$message.error("保存充值优惠异常:"+err)
                    })
            },

            /* --------------------- 车型(ok) --------------------- */
            initCarTypeData() {
                CarTypeApi.getCarTypeList()
                    .then((data) => this.carTypeList = data.data)
                    .catch(err => this.$message.warn("获取车型列表异常:"+err));
            },

            addCarTypeTap() {
                AddPagesUtils.showAddPages(Constant.viewType.CARTYPE_ADD);
            },

            /* --------------------- 优惠规则(子结点) --------------------- */
            loadStandardChildren(id) {
                ChargeSettingApi.getChargeStandardList({id})
                    .then((data) => {
                        /* 赋值 */
                        let standardData = data.data[0];
                        this.standardData = standardData
                        /* 处理 */
                        standardData.moneyCeiling = (standardData.moneyCeiling || 0) / 100;
                        standardData.moneyFloor = (standardData.moneyFloor || 0) / 100;
                        standardData.dayMoneyCeiling = (standardData.dayMoneyCeiling || 0) / 100;
                        standardData.commonAdvanceFee = (standardData.commonAdvanceFee || 0) / 100;


                        /* 内部 */
                        let childModels = standardData.childModels || [];
                        childModels.forEach(item => {
                            item.fee = (item.fee || 0) / 100;
                            if (item.startTime) item.st = moment(item.startTime, "HH:mm")
                            if (item.endTime) item.et = moment(item.endTime, "HH:mm")
                        })
                        standardData.childModels = childModels;
                    }).catch(err => {
                        this.$message.error("获取收费规则异常！:"+err)
                    });
            },

            addStandardChildrenTap() {
                let childModels = this.standardData.childModels || [];
                let standardId = "native-";
                standardId += `${Date.now()}-${Math.random()}`;
                childModels.push({name: '新的规则', key: standardId, id: standardId})
                this.standardData.childModels = childModels;
            },

            deleteStandardChildrenTap() {
                if (!this.selectStandardItem || !this.selectStandardItem.id) {
                    this.$message.warn("请选择要移除的规则项！");
                    return;
                }
                let {id, standardId} = this.selectStandardItem;
                id += "";
                /* 本地的时候 */
                if (id.indexOf('native-') != -1) {
                    this.deleteStandardChildrenUI(id);
                    return;
                }
                /* 网络的时候 */
                ChargeSettingApi.delChargeStandardChild({id, standardId})
                    .then(data => {
                        console.log(data)
                        this.deleteStandardChildrenUI(id)
                    })
                    .catch(err => {
                        let data = err.data, msg = err.msg;
                        this.$message.warn(data || msg || "");
                    });
            },

            deleteStandardChildrenUI(id) {
                this.clearSelectStandardItem();
                let childModels = this.standardData.childModels;
                this.standardData.childModels = childModels.filter(item => item.id != id)
            },

            clearSelectStandardItem() {
                this.selectStandardItem = "";
            },

            standardChildrenTap(item) {
                this.selectStandardItem = item;
            },

            saveStandardChildren() {
                if (!this.selectStandardItem) {
                    this.$message.error("请选中一个收费规则进行保存");
                    return;
                }

                let objectA = {...this.selectStandardItem};
                let objectB = {...this.standardData};
                objectA.adminChargeStandardEntity = objectB;

                let id = objectA.id + "";
                if (id.indexOf('native-') != -1) objectA.id = null;

                if (this.checkIsUndefind(objectA.dateType)) {
                    this.$message.error("请选择日期类型！");
                    return;
                }

                if (this.checkIsUndefind(objectA.carType)) {
                    this.$message.warn("请选择车辆类型");
                    return;
                }

                if (this.checkIsUndefind(objectA.chargeType)) {
                    this.$message.warn("请选择收费类型！");
                    return;
                }

                if (this.checkIsUndefind(objectA.st)) {
                    this.$message.error("请设定起始收费时间！");
                    return;
                }
                objectA.startTime = objectA.st.format("HH:mm");

                if (this.checkIsUndefind(objectA.et)) {
                    this.$message.error("请选择结束收费时间！");
                    return;
                }
                objectA.endTime = objectA.et.format("HH:mm");

                if (objectA.fee != undefined) objectA.fee *= 100;

                //objectA.isDefaultStandard = "";
                objectA.standardId = this.selectedChargeKeys[0];
                objectA.unitFreeMinute = objectA.unitFreeMinute || '0';


                /* 子规则bean处理 */
                // if (objectB.moneyCeiling == '' || objectB.moneyCeiling === 0) {
                //     this.$message.warn("收费上限必须大于0！");
                //     return;
                // }
                // if (objectB.dayMoneyCeiling == '' || objectB.dayMoneyCeiling === 0) {
                //     this.$message.warn("24收费上限必须大于0！");
                //     return;
                // }

                if (objectB.moneyCeiling != undefined) objectB.moneyCeiling *= 100;
                if (objectB.moneyFloor != undefined) objectB.moneyFloor *= 100;
                if (objectB.dayMoneyCeiling != undefined) objectB.dayMoneyCeiling *= 100;
                if (objectB.extraMinute != undefined) objectB.extraMinute *= 100;
                if (objectB.commonAdvanceFee != undefined) objectB.commonAdvanceFee *= 100;
                objectB.rechargeMoney = "";
                objectB.giveMoney = "";
                objectB.bindParkIds = (objectB.parkSimpleModels || []).map(item => item.pid).join(',');

                ChargeSettingApi.addChargeStandardChild(JSON.stringify(objectA))
                    .then((data) => {
                        this.selectStandardItem.startTime = objectA.startTime;
                        this.selectStandardItem.endTime = objectA.endTime;
                        this.selectStandardItem.id = data.data;
                        this.selectStandardItem.standardId = objectA.standardId;
                        this.$message.success("保存成功！");

                        this.clearSelectStandard();
                        this.clearSelectStandardItem();
                        this.initChargeStandardTreeData();
                    })
                    .catch(err => {
                        this.$message.warn(err.data || err.msg || "保存收费标准/规则异常！")
                    });
            },

            /* --------------------- 停车点 --------------------- */
            parkingPoint() {
                ChargeSettingApi.point()
                    .then((data) => this.parkPointList = data.data)
                    .catch(error => this.$message.error("获取停车点失败:"+error))
            },

            parkingPointName() {
                ChargeSettingApi.pointName()
                    .then((data) => this.parkingName = data.data.parks)
                    .catch(error => this.$message.error("获取停车点名字失败:"+error))
            },

            /* --------------------- 停车点弹窗 --------------------- */
            showModal() {
                this.visible = true;
                /* --- 得出停车点 --- */
                let standardData = this.standardData;
                let parkList = standardData.parkSimpleModels || [];
                this.selectParkIds = parkList.map(item => item.pid);
            },

            selectParkPoint() {
                this.visible = false;
                let selectParkIds = this.selectParkIds || [], len = this.selectParkIds.length;
                let parkingName = this.parkingName || [];
                let result = [];
                for (let i = 0; i < len; i++) {
                    let parkId = selectParkIds[i];
                    if (parkId.split('-').length != 1) continue;
                    let item = parkingName.filter(item => item.id == parkId).map(item => {
                        return {pid: item.id, parkName: item.name}
                    })[0];
                    if (!item) continue;
                    result.push(item)
                }
                this.standardData.parkSimpleModels = result;
            },

            /* ----------------------- 工具类 ------------------------ */
            checkIsUndefind(str) {
                if (str == undefined || str == '') return true;
                return false;
            },

            /* --------------------- 阶梯收费弹窗 ---------------------- */
            showEditStairView() {
              let {stair} = this.selectStandardItem;
              AddPagesUtils.showAddPages(Constant.viewType.STAIRS, {data: stair || ''}, this.commitEditStair);
            },

            showEditStairView2() {
                let {stairAvg} = this.selectStandardItem;
                AddPagesUtils.showAddPages(Constant.viewType.STAIRSBYAVG, {data: stairAvg || ''}, this.commitEditStairAvg);
            },

            commitEditStair(data) {
                data = data || [];
                let stair = "", len = data.length;
                for (let i = 0; i < len; i++) {
                    let item = data[i];
                    if (i != 0) stair += ';'
                    stair += `${item.minute},${item.charge}`;
                }
                /* set get */
                this.$set(this.selectStandardItem, 'stair', stair)
            },

            commitEditStairAvg(data) {
                data = data || [];
                let stairAvg = "", len = data.length;
                for (let i = 0; i < len; i++) {
                    let item = data[i];
                    if (i != 0) stairAvg += ';'
                    stairAvg += `${item.minute},${item.charge}`;
                }
                /* set get */
                this.$set(this.selectStandardItem, 'stairAvg', stairAvg)
            },

            onlineUpgradeSwitchChangedByDefault(checked) {
                let isDefaultStandard = checked ? 1 : 0;
                this.$set(this.selectStandardItem, 'isDefaultStandard', isDefaultStandard)
                //this.updateOperate(condition);
            },
        },

        computed: {

            standardChildrenStyle() {
                return function (id) {
                    return (this.selectStandardItem && this.selectStandardItem.id) == id ? "background-color: #B7F0FF" : ""
                }
            },

            getStandardChildrenName() {
                return function (item) {
                    let {dateType, carType, startTime, endTime, id} = item
                    if (isNaN(id)) return "新的规则";
                    return `${this.getDateTypeName(dateType)}-${this.getCarTypeName(carType) || '无'}(${startTime}-${endTime})`;
                };
            },

            isSelectRoot() {
                let selectedChargeKeys = this.selectedChargeKeys;
                if (selectedChargeKeys.length != 1) return false;
                let key = selectedChargeKeys[0] + "";
                return key.split('-').length == 2;
            },

            isSelectLeaf() {
                let selectedChargeKeys = this.selectedChargeKeys;
                if (selectedChargeKeys.length != 1) return false;
                let key = selectedChargeKeys[0] + "";
                return key.split('-').length == 1;
            },

            /* -------- car -------- */
            getDateTypeName() {
                return function (dateType) {
                    let dateTypeList = this.dateTypeList || [];
                    return dateTypeList.filter(item => item.key == dateType).map(item => item.title)[0]
                }
            },

            getCarTypeName() {
                return function (carType) {
                    let carTypeList = this.carTypeList || [];
                    return carTypeList.filter(item => item.id == carType).map(item => item.typeName)[0];
                }
            },

            /* -------- 显示层 -------- */
            getParkName() {
                return function (parkList) {
                    let array = parkList || [];
                    return array.map(item => item.parkName).join(',');
                }
            },

            getStairName() {
                return function (stair) {
                    if (!stair) return "";
                    let array = stair.split(';') || [], len = array.length;
                    let result = "";
                    for (let i = 0; i < len; i++) {
                        let split = array[i].split(',');
                        result += `${split[0]}分钟-${split[1] / 100}元\n`;
                    }
                    return result;
                }
            },

            getStairName2() {
                return function (stairAvg) {
                    if (!stairAvg) return "";
                    let array = stairAvg.split(';') || [], len = array.length;
                    let result = "";
                    for (let i = 0; i < len; i++) {
                        let split = array[i].split(',');
                        result += `${split[0]}分钟内平均每分钟${split[1] / 100}元\n`;
                    }
                    return result;
                }
            },

            switchChecked() {
                return function (value) {
                    return value == '1';
                }

            },
        },

        mounted() {
            /* 获取树 */
            this.initChargeStandardTreeData();
            this.parkingPoint();
            this.parkingPointName()
        },
    }
</script>

<style scoped>

    .content {
        width: 100%;
        height: 100%;
        position: relative;
    }

    .header-setting {
        width: 100%;
        height: 174px;
        background: #fff;
    }

    .breadcrumb {
        margin-left: 41px;
        padding-top: 15px;
    }

    .top {
        border-bottom: 0.01rem solid rgba(54, 49, 59, 0.25);
        height: 0.8rem;
    }

    .top .operation {
        display: flex;
        justify-content: flex-end;
    }

    .top div {
        /*width: 1900px;*/
        /*min-width: 1900px*/
    }

    .bottom-left {
        border-right: 0.01rem solid rgba(54, 49, 59, 0.25);
        position: absolute;
        top: 0.8rem;
        bottom: 0rem;
        left: 0rem;
        width: 4rem;
        /*height: 8.07rem;*/
        /*min-height: 8.07rem;*/
        overflow: auto;
    }

    .bottom-right {
        width: 80%;
    }

    .bottom-right2 {
        width: 80%;
        position: absolute;
        top: 0.8rem;
        left: 4rem;
        padding: 0.1rem 0 0 0.1rem;
    }

    .bottom-right2 .item {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 10px;
    }

    .item .itemText {
        margin: 0 0.1rem;
    }

    .item input {
        margin: 0 0.1rem;
        width: 1.1rem;
    }

    .item button {
        margin: 10px;

    }

    .bottom-right .right-one {
        border-left: 0.01rem solid rgba(54, 49, 59, 0.25);
        border-bottom: 0.01rem solid rgba(54, 49, 59, 0.25);
        border-right: 0.01rem solid rgba(54, 49, 59, 0.25);
        position: absolute;
        top: 0.8rem;
        left: 4rem;
        width: 3.5rem;
        height: 4.7rem;
        padding: 0.1rem 0 0 0.1rem;
    }

    .bottom-right .right-one div:nth-child(1) {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 0 0.1rem 0;

    }

    .bottom-right .right-two {
        position: absolute;
        top: 0.9rem;
        left: 7.8rem;
        height: 4.7rem;
    }


    .standardItem {
        display: flex;
        align-items: center;
        margin-top: 0.05rem;
        padding: 0.05rem 0;
    }

    .standardItem .itemText {
        margin: 0 0.1rem;
        width: 1.4rem;
    }

    .standardItem input {
        margin: 0 0.2rem;
        width: 2rem;
    }

    .standardItem .ant-time-picker {
        margin: 0 0.2rem;
    }


    textarea {
        margin: 0 0 0 0.2rem;
        min-height: 0.8rem;
        resize: none;
    }

    .ant-select {
        margin: 0 0.1rem;
        width: 2rem;
    }

    .ant-switch-checked {
        background-color: #1890ff;
    }

</style>
